* {
	padding: 0;
	margin: 0;
	box-sizing: border-box;
}

html {
	font-size: 100px;
}

body {
	font-size: 16px;
}

#app {
	width: 6rem;
	margin: 1rem auto;
	display: flex;
	font-size: .28rem;
	flex-direction: column;
}

.item {
	width: 100%;
	display: flex;
	border-bottom: 1px solid gray;
	font-size: .28rem;
}

.item1 {
	width: 1rem;
	flex: 5;
	padding: .1rem;
	line-height: .5rem;
	border-right: 1px solid gray;
}

.item2,
.list {
	flex: 1;
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	padding: .2rem 0;
}

.item2 img,
.list img {
	width: .4rem;
}

.item2 p {
	font-size: .24rem;
}

.footer {
	width: 100%;
	display: flex;
	font-size: .2rem;
}

.list1,
.list2,
.list3 {
	flex: 1;
}

.list4 {
	flex: 2;
	background: #FFA602;
	color: #fff;
}

.list5 {
	flex: 2;
	background: #EB4551;
	color: #fff;
}
